<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no,maximum-scale=1,minimum-scale=1">
	<title>移动开发页面</title>
	<style>
		*{
			margin: 0;
			padding:0;
		}
		html{
			font-size: 50px;
		}
		.nihao{
			width: 100px;
			height: 100px;
			background-color: pink;
		}

		.wraaper{
			width: 7.5rem;
			height: 200px;
			background-color: skyblue;
		}

		/*@media screen and (min-width: 1080px){
			.wraaper{
				width: 750px;
				margin: 0 auto;

			}
		}*/

		
	</style>
</head>
<body>

<div class="wraaper">
<div class="nihao"></div>
</div>

<script>
(function(){
	var baseSize = 50;
	var baseWidth = 375;
	var MfontSize = (document.documentElement.clientWidth / baseWidth *baseSize).toFixed(2);
	document.getElementsByTagName("html")[0].style.fontSize = MfontSize + "px";
})()
</script>
</body>
</html>